<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>课程列表</title>

    <link rel="stylesheet" type="text/css" th:href="@{/pubilc/plugin/layui/css/layui.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/pubilc/plugin/css/admin.css}"/>
</head>

<body>
<div class="page-content-wrap">
    <form class="layui-form" action="">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">用户昵称</label>
                <div class="layui-input-inline">
                    <input type="text" name="userName" placeholder="用户昵称" autocomplete="off"
                           class="layui-input">
                </div>
            </div>

            <button class="layui-btn layui-btn-normal" lay-filter="search" lay-submit>搜索</button>
        </div>
    </form>
    <div class="layui-form" id="table-list">

        <table class="layui-hide" id="table" lay-filter="table"></table>
    </div>
</div>
<script th:src="@{/pubilc/plugin/layui/layui.js}" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/pubilc/plugin/js/common.js}" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/pubilc/plugin/js/module/moment.js}" type="text/javascript" charset="utf-8"></script>

<script type="text/html" id="barTool" lay-filter="barTool">
    <a class="layui-btn layui-btn-success layui-btn-xs" lay-event="refund">退款</a>
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="sendEnd">支付尾款</a>
</script>
<style type="text/css">
    .layui-table-cell {
        height: auto;
        line-height: 28px;
    }
</style>
<script>
    layui.use(['jquery', 'table', 'form', 'laydate'], function () {
        var $ = layui.jquery;
        var table = layui.table;
        var form = layui.form;
        var laydate = layui.laydate;

        var tableIns = table.render({
            elem: '#table'
            , url: parent.basePath + '/play/page/getClassStatus'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , page: true
            , limit: 15
            , autoSort: false
            , cols: [[
                {field: 'id', width: 80, title: 'ID', sort: true}
                , {field: 'userName', width: 120, title: '用户名'}, {
                    field: 'headUrl', width: 150, title: '头像', templet: function (d) {
                        return "<div><img src='" + d.headUrl + "'></div>"
                    }
                }
                , {field: 'tel', width: 150, title: '电话'}
                , {field: 'teacher', width: 150, title: '老师'}
                , {field: 'teacherTel', width: 150, title: '老师电话'}
                , {field: 'classDesc', width: 150, title: '课程描述'}
                , {field: 'classTreeDesc', width: 180, title: '课程子描述'}
                , {field: 'money', width: 120, title: '课程价格'}
                , {field: 'message', width: 150, title: '留言'}, {
                    field: 'classStatus', width: 80, title: '课程状态', templet: function (d) {
                        // 0未审核  1-5  待上1-5  6完成
                        if (d.classStatus == 0) {
                            return '未审核';
                        }
                        if (d.classStatus > 0 && d.classStatus < 6) {
                            return '第' + d.status + "课";
                        }
                        if (d.classStatus = -2) {
                            return '已退款';
                        }
                        if (d.classStatus = 6) {
                            return '完成';
                        }
                        return d.classStatus;
                    }
                }
                , {
                    field: 'createdTime', width: 200, title: '报名时间', templet: function (d) {
                        return moment(d.createTime).format('YYYY-MM-DD HH:mm:ss');
                    }
                }, {
                    field: 'payType', width: 120, title: '付款情况'
                }
                , {title: '操作', toolbar: '#barTool', width: 180}

            ]]
            , response: {
                countName: 'total' //规定数据总数的字段名称，默认：count
                , dataName: 'list' //规定数据列表的字段名称，默认：data
            }
        });

        //查询
        form.on('submit(search)', function (data) {
            tableIns.reload({where: data.field});
            return false
        });

        //日期
        laydate.render({
            elem: '#createdTime'
            , type: 'datetime'
        });


        //工具栏事件
        table.on('tool(table)', function (obj) {
            switch (obj.event) {
                case 'refund':
                    //询问框
                    layer.confirm('您确定要退款吗？', {
                        btn: ['确定', '取消'] //按钮
                    }, function () {
                        $.ajax({
                            url: parent.basePath + '/play/page/refundClass',
                            data: {
                                id: obj.data.id,
                            },
                            type: "POST",
                            cache:
                                false,
                            dataType:
                                'json',
                            error:

                                function (request) {
                                    alert("发送请求失败！");
                                }

                            ,
                            success: function (json) {
                                if (json.code == 0) {
                                    layer.msg(json.msg);
                                    setTimeout(function () {
                                        tableIns.reload();
                                    }, 1000);
                                } else {
                                    layer.msg(json.msg);
                                }
                            }
                        })
                        ;


                    }, function () {
                        return;
                    });
                    break;

                case 'sendEnd':
                    //询问框
                    layer.confirm('您确定要支付尾款吗？', {
                        btn: ['确定', '取消'] //按钮
                    }, function () {
                        $.ajax({
                            url: parent.basePath + '/play/page/sendEndClass',
                            data: {
                                id: obj.data.id,
                            },
                            type: "POST",
                            cache:
                                false,
                            dataType:
                                'json',
                            error:

                                function (request) {
                                    alert("发送请求失败！");
                                }

                            ,
                            success: function (json) {
                                if (json.code == 0) {
                                    layer.msg(json.msg);
                                    setTimeout(function () {
                                        tableIns.reload();
                                    }, 1000);
                                } else {
                                    layer.msg(json.msg);
                                }
                            }
                        })
                        ;


                    }, function () {
                        return;
                    });
                    break;
            }
        });


        //赋值
        function setValue(data) {
            for (index in $("#ListForm form input")) {
                let name = $("#ListForm form input")[index].name;
                if (name != '') {
                    $("[name=" + name + "]").val(data[name]);
                }
            }
        };

        //修改提交
        form.on('submit(submit)', function (data) {
            layer.confirm('您确定修改吗？', {
                btn: ['确定', '取消'] //按钮
            }, function () {
                $.ajax({
                    url: parent.basePath + '/play/page/updateComment',
                    data: data.field,
                    type: "POST",
                    cache: false,
                    dataType: 'json',
                    error: function (request) {
                        alert("发送请求失败！");
                    },
                    success: function (json) {
                        if (json.code == 0) {
                            layer.msg(json.msg);
                            setTimeout(function () {
                                layer.closeAll();
                                tableIns.reload();
                            }, 1000);
                        } else {
                            layer.msg(json.msg);
                        }
                    }
                });
            }, function () {
                layer.close(layer.index);
                return false;
            });

            return false
        });

        //关闭按钮
        form.on('submit(close)', function (data) {
            layer.closeAll();
            return false;
        });


        //监听排序事件
        table.on('sort(table)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            //有些时候，你可能需要根据当前排序的字段，重新向服务端发送请求，从而实现服务端排序，如：
            tableIns.reload({
                initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。
                , where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                    order: obj.field + ' ' + obj.type //排序方式
                }
            });

        });


    });
</script>


<div style="display: none" id="ListForm" lay-filter="ListForm">
    <form class="layui-form" action="">
        <input type="text" name="id" autocomplete="off" class="layui-input" type="hidden">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">ID</label>
                <div class="layui-input-inline">
                    <input type="text" name="id" autocomplete="off" class="layui-input" readonly>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">评论者ID</label>
                <div class="layui-input-inline">
                    <input type="text" name="fromId" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">父评论</label>
                <div class="layui-input-inline">
                    <input type="text" name="isRoot" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">上级评论</label>
                <div class="layui-input-inline">
                    <input type="text" name="parentId" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">内容</label>
            <div class="layui-input-block">
                <input type="text" name="content" autocomplete="off"
                       class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">被评论ID</label>
                <div class="layui-input-inline">
                    <input type="text" name="toId" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">附加字段</label>
                <div class="layui-input-inline">
                    <input type="text" name="isAttached" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">时间</label>
                <div class="layui-input-inline">
                    <input type="text" id="createdTime" name="createdTime" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">是否私密</label>
                <div class="layui-input-inline">
                    <input type="text" name="isPrivate" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">是否已读</label>
                <div class="layui-input-inline">
                    <input type="text" name="isRead" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>


    </form>
</div>


</body>

</html>